<div class="page-header">
	<h3><span class="fa fa-users"></span>Users</h3>
</div>

<div class="col-md-12">
	<p class="alert alert-info">
		<span class="search_cd">Username:</span><input type="text" ng-model="name_search" ng-keyup="getUserList()"
			placeholder="username" name="username"> 
			
			<span class="search_cd">SourceIp:</span><input type="text" ng-model="ip_search" ng-keyup="getUserList()"
			placeholder="sourceip" name="sourceip"> 
			
<!--         <span style="margin-left: 15px;"> -->
<!-- 		<button class="btn btn-primary" ng-click=""> -->
<!-- 			<span class="glyphicon glyphicon-search"></span> <span class="font_st">Search</span> -->
<!-- 		</button></span> -->

	</p>
</div>

<table class="table altrowstable">
		<thead>
			<tr>
				<th >UserId</th>
				<th >Username</th>
				<th >Permission</th>
				<th >IP</th>
				<th >RegisterDate</th>
				<th >UpdateDate</th>
				<th >Black/White</th>
				<th >Edit</th>		
			</tr>
		</thead>
		<tbody >
			<tr ng-repeat="user in users" >
				
				<td >{{ user.id }}</td>
				<td >{{ user.name }}</td>
				<td >
				   <span ng-repeat="role in user.userRoleList">
				     <span ng-switch on="role.roles">
                       <span ng-switch-when="0">USER </span>
                       <span ng-switch-when="1">ADMIN</span>
                     </span>
				   </span>
				</td>
				<td >{{ user.sourceIp }}</td>
				<td >{{ user.createDate | date:'yyyy-MM-dd HH:mm:ss'}} </td>
				<td >{{ user.updateDate |  date:'yyyy-MM-dd HH:mm:ss'}}</td>
				<td >
				   <a ng-if="!user.black" href="" ng-click="blacklist(user.id)" class="btn btn-xs btn-default" title="blacklist">black</a>
				   <a ng-if="user.black" href="" ng-click="whitelist(user.id)" class="btn btn-xs btn-default" title="whitelist">white</a>
				</td>
				<td >
<!-- 					<button class="btn" ng-click="editUser($index+1)"> -->
<!-- 						<span class="glyphicon glyphicon-pencil"></span>编辑 -->
<!-- 					</button> -->
                  <a  href="" ng-click="editUser($index+1)" class="btn btn-xs btn-default" title="edit">Edit</a>
				</td>
			</tr> 
		</tbody>
	</table>
	<div class="col-md-12">
	    <tm-pagination conf="paginationConf"></tm-pagination>
	</div>
<!-- 	 <div class="col-md-12"> -->
<!-- 		<p class="alert alert-info">Notice: If you are the administrator , you will hava  -->
<!-- 		a ability to reset a user's role or authority and reset password</p> -->
<!-- 	</div> -->
    <hr>
	<button class="btn btn-success" ng-click="editUser('new')">
		<span class="glyphicon glyphicon-user"></span><span class = "font_st">Create new User</span>
	</button>
	<hr>

	<h3 ng-show="edit">Create new User:</h3>
	<h3 ng-hide="edit">Edit User:</h3>

   <div class="col-md-12">
		<p class="alert alert-info">Notice: If you are the administrator , you will hava 
		a ability to reset a user's role or authority and reset password. of course, you can also add a new user</p>
	</div>
	<form class="form-horizontal">
		<div class="form-group">
			<label class="col-sm-2 control-label">Username:</label>
			<div class="col-sm-10">
				<input type="text" ng-model="username" ng-disabled="!edit"
					placeholder="username">
			</div>
		</div>
		<div class="form-group" >
			<label class="col-sm-2 control-label">New Password:</label>
			<div class="col-sm-10">
				<input type="password" ng-model="passw1" placeholder="password">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">Confirm Password:</label>
			<div class="col-sm-10">
				<input type="password" ng-model="passw2" placeholder="password">
			</div>
		</div>
		
<!-- 		<div class="form-group"> -->
<!-- 			<label class="col-sm-2 control-label">confirm password:</label> -->
<!-- 			<div class="col-sm-10"> -->
<!-- 				<input type="password" ng-model="passw3" placeholder="password"> -->
<!-- 			</div> -->
<!-- 		</div> -->
		
		<div class="form-group" ng-hide="edit" >
			<label class="col-sm-2 control-label">Authority:</label>
			<div class="col-sm-10">
				<select ng-model="role" ng-options="role.rolesDesc for role in roles">
                </select>
			</div>
		</div>
	</form>
    
	<button class=" modify btn btn-success" ng-hide="edit" ng-click="modifyUserInfo(index)" ng-disabled="error || incomplete">
		<span class="glyphicon glyphicon-save"></span><span class = "font_st">Modify</span>
	</button>
	
	<button class=" modify btn btn-success"  ng-show="edit" ng-click="addUser()" ng-disabled="error || incomplete">
		<span class="glyphicon glyphicon-save"><span ng-show="edit"  class="font_st">Add</span></span>
	</button>
	
	<hr>


